<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
	<link rel="stylesheet" href="./css/style.css"> 
	<script src="./config.js"></script>
	<script src="./form-template/default.js"></script>
	<script src="./js/vue.js"></script>
	<script src="./js/md5.js"></script>
	<script src="./js/util.js"></script>
	<script src="./template/templateConfig.js"></script>
	<script src="./js/jquery-1.11.0.min.js"></script>
</head>
<body>
	<section class="container">
		<section class="head">
			
		</section>
		<section class="body">
			<div class="widget-warp">
				<h3 class="block-title">常用控件</h3>
				<ul class="col" id="dragWidget" >
					<li data-type="input.text">
						文本框
					</li>
					<li data-type="select.normal">
						下拉框
					</li> 
					<li data-type="checkbox">
						多选框
					</li>
					<li data-type="textarea">
						文本域
					</li>
					<li data-type="button.submit">
						提交按钮
					</li>
					<li data-type="button.button">
						普通按钮
					</li>
					<li data-type="radio" style="border-bottom: none">
						单选框
					</li>
					<li data-type="line" style="border-bottom: none">
						分隔符
					</li>
				</ul>
				<h3 class="block-title">信息字段</h3>
				<ul class="col" id="dragWidget">
					<li data-type="input.name">
						姓名
					</li>
					<li data-type="input.email">
						电子邮箱
					</li> 
					<li data-type="input.address"  style="border-bottom: none">
						地址
					</li>
					<li data-type="input.phonenumber"  style="border-bottom: none">
						电话
					</li> 
				</ul>
				<h3 class="block-title">特殊控件</h3>
				<ul class="col" id="dragWidget">
					<li data-type="select.area">
						省市县三联动
					</li>
					<li data-type="table.normal">
						表格
					</li> 
					<li data-type="markdown"  style="border-bottom: none">
						MarkDown
					</li> 
					<li data-type="htmlcam"  style="border-bottom: none">
						Html5Cam
					</li> 
				</ul>
				<h3 class="block-title">容器</h3>
				<ul class="col" id="dragWidget">
					<li data-type="layout lrow" data-container="1">
						并排
					</li> 
					<li data-type="layout lcol" data-container="1">
						竖排
					</li>
				</ul>
			</div>
			<div class="canvas-warp">
				<h3 class="block-title">舞台 <img src="./img/set.png" alt="" id="stageSet" class="icon-img pull-right"></h3>
				<div class="canvas-form-warp">

				</div>
			</div>
			<div class="property-warp">
				<h3 class="block-title">表单属性</h3>
				<div class="set-property">
					
				</div>
			</div>
		</section>
		<section class="foot">
			
		</section>
		<div id="stageSetBox" class="stage-set-warp temp-pro-warp">
			<div class="form-group">
				<label>表单的宽度:</label>
				<input type="text" class="form-control input-sm" value="625px" id="stageWidthInput" >
			</div> 
			<div class="form-group">
				<label>表单的名称:</label>
				<input type="text" class="form-control input-sm" value="这是一个表单" id="stageFormTitle" >
			</div>
			<div class="form-group"> 
				<a class="btn btn-default btn-xs" role="button" id="previewFormButton">预览表单</a>
				<a class="btn btn-default btn-xs" role="button" id="generateFormButton">生成HTML代码</a>
			</div>
		</div>
	</section>
	<script src="./js/index.js"></script>
</body>
</html>